<script>
import SonCom from "@/components/sonCom.vue";
import SonCom1 from "@/components/sonCom1.vue";

export default {
  name: "fatherPage",
  components: {SonCom1, SonCom},
  data(){
    return {
      giveSonData:'父组件的数据',
      giveSonData1:[1,2,3]
    }
  },
  methods:{
    sonData(data){
      console.log(data,'子组件的数据123')
    }
  }
}
</script>

<template>
<div>父组件
  <!--  一、父传子
             1.在父组件中的子标签中自定义一个属性
             2.在子组件中用props接收
       -->
  <son-com :giveSon="giveSonData"></son-com>
  <son-com :giveSon1="giveSonData1"></son-com>
<!--    二、子传父
        1.在父组件中的子标签中自定义一个方法，方法中的参数就是子组件传过来的数据
        2.在子组件中$emit('自定义方法名',传递的参数)方法中进行传参-->
  <son-com1 @fromSon="sonData"></son-com1>
</div>

</template>

<style scoped lang="less">

</style>